<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>原生数据请求</title>
    <script src="jquery-1.12.4.js"></script>
</head>
<body>
    <input type="text" id="text">
    <input type="button" value="获取文章信息" id="btn">
    <div id="content"></div>
    <script>
        $("#btn").click(function(){
        let id = $("#text").val();

// 1-创建对象XMLHttpRequest()
        // ie浏览器，非浏览器
        if(window.XMLHttpRequest){//true =最新版的ie浏览器或者其他浏览器
            xhr = new XMLHttpRequest();

        }else{//ie5/ie6
            xhr = new ActiveXObject("Microsoft.XMLHTTP")
        }
        // 2-创建回调函数====>得到数据之后干什么
        xhr.onreadystatechange=callBack;
        // 3-初始化XMLHttpRequest()对象，open()，，和谁访问，访问的方式，传递的数据
        // 39.103.160.49
        let url = "http://127.0.0.1:8888/index/article/findById?id="+id
        xhr.open("GET",url,true)//true是否进行异步
        // 4-发送请求
        xhr.send(null);


        function callBack(){
            if(xhr.readyState ==4 || xhr.status==200){
                let data = xhr.responseText;///返回的文本数据
                console.log(data);   
                // document.write(data)   
                $("#content").html(data)          
            }
        }
        })
        


    </script>

</body>
</html>